<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>属性选择器</title>
</head>

<style>
    /*匹配所有包含title属性的元素*/
    /*[title] {*/
    /*    background-color: red;*/
    /*}*/


    /*匹配所有由p标签中的 title属性的元素*/
    /*p[title] {*/
    /*    background-color: red;*/
    /*}*/

    /*匹配指定属性的值*/
    /*[title="this is a test"]{*/
    /*    background-color: fuchsia;*/

    /*}*/

    /*匹配属性中包含的值*/
    /*[title ~= "this"]{*/
    /*    background-color: fuchsia;*/
    /*}*/


    /*匹配指定属性的指定属性具有多个连接分隔符的值*/
    /*[title |= "this"]{*/
    /*    background-color: red;*/

    /*}*/

    /*匹配指定属性的以t开头的属性*/
    /*[title ^= "t"]{*/
    /*    background-color: red;*/

    /*}*/

    /*匹配指定属性的以t开头的结尾*/
    /*[title $= "t"]{*/
    /*    background-color: red;*/

    /*}*/

    /*匹配指定属性中包含的值*/
    [title *= "a"]{
        background-color: red;

    }




</style>


<body>

<p title="this is a test">我是一个P标签</p>
<p title="this is a test">我是第二个P标签</p>
<p title="this">我是第三个P标签</p>
<a href="" title="this is a test">我是a标签</a>
<p index="1000">我是最后一个P标签</p>
<p title="this-is-a-test">我是新增的P</p>
<span title="this is a test">我是span标签</span>


</body>
</html>